<%@ page import="com.blog.service.BlogService"%>
<%@ page import="com.blog.service.impl.BlogServiceImpl"%>
<%@ page import="com.blog.service.PhotoService"%>
<%@ page import="com.blog.service.impl.PhotoServiceImpl"%>
<%@ page import="com.blog.service.RightService"%>
<%@ page import="com.blog.service.impl.RightServiceImpl"%>


<%@ page import="com.blog.entity.Blog"%>
<%@ page import="java.util.List"%>
<%@ page import="com.blog.util.MarkDownUtil"%>
<%@ page import="com.blog.util.Page"%>


<%@ page contentType="text/html;charset=UTF-8" language="java"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<base href="<%=basePath%>}">
<%
    //分页
    int start = 0;
    int count = 6;
    int pageNumber=1;
    try {

        pageNumber=Integer.parseInt(request.getParameter("page"));
        start = Integer.parseInt(request.getParameter("page.start"));
        count = Integer.parseInt(request.getParameter("page.count"));

    } catch (Exception e) {

    }
    Page pageBreak = new Page(start, count,pageNumber);





    String tagName=request.getParameter("tagName");

    BlogService blogService=new BlogServiceImpl();
    PhotoService photoService=new PhotoServiceImpl();
    RightService rightService=new RightServiceImpl();

    request.setAttribute("pageBreak", pageBreak);
    request.setAttribute("ShowBlogByPage", selAllBlogToHtml(blogService.selBlogByPage(pageBreak.ToStart(pageBreak.getPageNumber(),pageBreak.getCount()), pageBreak.getCount())));

    request.setAttribute("right",rightService.selRight());
    request.setAttribute("ShowTagDetail",selAllBlogToHtml(blogService.selBlogByTagName(tagName)));
    request.setAttribute("HeaderPhoto",photoService.selPhoto(1));
    request.setAttribute("showArchivesCount",blogService.selAllBlogCount());

    pageBreak.setTotal(blogService.selBlogByTagName(tagName).size());

%>
<%!
    public static List<Blog> selAllBlogToHtml(List<Blog> list){
        for(Blog blog:list){
            blog.setContent(MarkDownUtil.mdToHtml(blog.getContent()));
        }
        return list;
    }
%>
<!DOCTYPE html>
<html lang="zh-CN" data-theme="light">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>时间轴</title>
<link rel="shortcut icon" href="blog/img/favicon.png">
<link rel="stylesheet" href="blog/css/index.css">
<link rel="stylesheet"
	href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free/css/all.min.css">
<link rel="stylesheet"
	href="https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@latest/dist/jquery.fancybox.min.css">
<style>
.pageJump {
	display: inline-block;
	padding-left: 0;
	margin: 0px 0px 0px 60px;
	border-radius: 4px;
	vertical-align: top;
}

.pageJump input {
	width: 40px;
}

.pageJump .button, .pageJump input {
	font-size: 16px;
	margin-left: -1px;
	line-height: 1.42857143;
	color: #337ab7;
	text-decoration: none;
	background-color: #fff;
	border: 1px solid #ddd;
}

#page-header.full_page {
	height: 50vh !important;
}
</style>
<script src="blog/js/global_config.js"></script>
<script id="config_change" src="blog//js/global_change.js"></script>
<script src="blog/js/set_theme.js"></script>
<meta name="generator" content="Hexo 5.1.1">
</head>

<body>
	<!-- 引入头部 -->
	<jsp:include page="header.jsp" flush="true" />
	<div id="body-wrap">
		<main class="layout_page" id="content-inner">
		<div id="archive">
			<div class="article-sort-title">
				标签 -
				<%=tagName%>
			</div>
			<div class="article-sort">
				<div class="article-sort-item year" id="getFullYear">2020</div>
				<c:forEach items="${requestScope.ShowTagDetail}" var="blog"
					begin="0" end="${pageBreak.count}" step="1">
					<div class="article-sort-item">
						<a class="article-sort-item-img"
							href="BlogShowServlet?blogID=${blog.id}" title="${blog.title}"><img
							src="${blog.photo}" alt="${blog.title}"
							onerror="this.onerror=null;this.src='blog/img/404.jpg'"></a>
						<div class="article-sort-item-info">
							<div class="article-sort-item-time">
								<i class="far fa-calendar-alt"></i>
								<time class="post-meta-date-created"
									datetime="2020-09-07T09:26:15.103Z"
									title="发表于 ${blog.uploadTime}">${blog.uploadTime}</time>
							</div>
							<a class="article-sort-item-title"
								href="BlogShowServlet?blogID=${blog.id}" title="${blog.title}">${blog.title}</a>
						</div>
					</div>
				</c:forEach>

			</div>


			<%--分页--%>
			<nav id="pagination">
				<div class="pagination">
					<a class="extend prev" id="prevBlogPage" rel="prev"
						href="blog/detailTag.jsp?page=${pageBreak.pageNumber-1}"> <i
						class="fa fa-fw fa-chevron-left" aria-hidden="true"></i>
					</a> <a id="FirstPage" class="page-number current"
						href="blog/detailTag.jsp?page=1">1</a>
					<c:forEach begin="2" end="3" step="1" varStatus="var">
						<a class="page-number"
							href="blog/detailTag.jsp?page=${var.current}">${var.current}</a>
					</c:forEach>

					<c:if
						test="${pageBreak.getTotalPage()>3&&pageBreak.pageNumber-2>3}">
						<a class="space">&hellip;</a>
					</c:if>

					<c:if test="${pageBreak.pageNumber>3}">

						<c:if test="${pageBreak.pageNumber!=4}">
							<a class="page-number"
								href="blog/detailTag.jsp?page=${pageBreak.pageNumber-1}">${pageBreak.pageNumber-1}</a>
						</c:if>

						<c:if test="${pageBreak.getTotalPage()!=pageBreak.pageNumber}">
							<a class="page-number"
								href="blog/detailTag.jsp?page=${pageBreak.pageNumber}">${pageBreak.pageNumber}</a>
						</c:if>

						<c:if test="${pageBreak.getTotalPage()>pageBreak.pageNumber+1}">
							<a class="page-number"
								href="blog/detailTag.jsp?page=${pageBreak.pageNumber+1}">${pageBreak.pageNumber+1}</a>
						</c:if>

					</c:if>

					<c:if
						test="${pageBreak.getTotalPage()>3&&pageBreak.pageNumber!=pageBreak.getTotalPage()&&pageBreak.pageNumber+3<pageBreak.getTotalPage()}">
						<a class="space">&hellip;</a>
					</c:if>

					<c:if test="${pageBreak.getTotalPage()>3}">
						<a class="page-number"
							href="blog/detailTag.jsp?page=${pageBreak.getTotalPage()}">${pageBreak.getTotalPage()}</a>
					</c:if>

					<a class="extend next" id="nextBlogPage" rel="next"
						href="blog/detailTag.jsp?page=${pageBreak.pageNumber+1}"> <i
						class="fa fa-fw fa-chevron-right" aria-hidden="true"></i>
					</a>

					<div class="pageJump">
						<span>跳转到</span> <input type="text" id="goToPage" name="goToPage"
							value="" /> <span>页</span>
						<button type="button" class="button" onclick="goToPage()">确定</button>
					</div>
				</div>

			</nav>


		</div>

		<jsp:include page="right.jsp" /> </main>
		<jsp:include page="footer.jsp" />
	</div>
	<script src="blog/js/jquery.min.js"></script>
	<script src="blog/js/main.js"></script>
	<script src="blog/js/utils.js"></script>
	<!-- 	<script src="blog/js/tw_cn.js"></script>  -->
	<script
		src="https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@latest/dist/jquery.fancybox.min.js"></script>
	<script
		src="https://cdn.jsdelivr.net/npm/instant.page@latest/instantpage.min.js"
		type="module"></script>
	<script
		src="https://cdn.jsdelivr.net/npm/lazysizes@latest/lazysizes.min.js"
		async=""></script>

	<script>
    $(function () {



        //跳转到指定页
        function goToPage() {

            var pageNum=$("#goToPage").val();

            pageNum=parseInt(pageNum);

            window.location.href="blog/detailTag.jsp?page="+pageNum;
        }



        //得到=后的页码  分页
        var sub=(window.location+"").split("=");

        if(sub[1]!="1"){
            $("#FirstPage").removeClass("current");
        }

        if(sub[1]==undefined||1=="${pageBreak.getTotalPage()}"){
            $("#FirstPage").addClass("current");
        }
        //为改页码加入样式
        $(".pagination a").each(function () {
            if($(this).html()==sub[1]){
                $(this).addClass("current");
            }
        })

        if(sub[1]=="1"||sub[1]==undefined||1=="${pageBreak.getTotalPage()}"){
            $("#prevBlogPage").css("display","none");
        }

        if(sub[1]=="${pageBreak.getTotalPage()}"||1=="${pageBreak.getTotalPage()}"){
            $("#nextBlogPage").css("display","none");
        }

        $(".pagination a").each(function () {
            if(parseInt($(this).html())>parseInt("${pageBreak.getTotalPage()}")){
                $(this).css("display","none");
            }
        })



        $("ul.pagination li.disabled a").click(function () {
            return false;
        });

        $(".pagination a").each(function () {
            if(parseInt($(this).html())>parseInt("${pageBreak.getTotalPage()}")){
                $(this).css("display","none");
            }
        })
        //分页

        var date = new Date();
        var year = date.getFullYear();
        $("#getFullYear").val(year);

        $("#site_title").html("<%=tagName%>");
        //顶部背景图片
        $(".not-index-bg").css("background-image","url("+"${requestScope.HeaderPhoto.aboutPhoto}"+")");

    })
</script>
</body>
</html>

